<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <style type="text/css" rel="stylesheet">
        	*{
        		margin:0;
        		padding:0;
                line-height: 1;
        	}
        	#test{
        		position: relative;
        		margin-top:150px;
        		width:240px;
        		height:150px;
        		background:yellow;
        	}
        </style>
    </head>
    <body>
    	<div id="test">233</div>

        <input type="text" id="clock" />

    	<script type="text/javascript" src="tween.js"></script>
    	<script type="text/javascript">
            window.onload = function(){
                var totalTime = 2000;
                var t=0,b=0,c=250,d=500;
                var step = c/d;
                var interval = totalTime/d;
                function Run(){
                   // console.log(t);
                    // console.log(Math.ceil(Tween.Quad.easeOut(t,b,c,d)))
                    test.style.left = Math.ceil(Tween.Quad.easeOut(t,b,c,d)) + "px";
                    if (Math.ceil(Tween.Quad.easeOut(t,b,c,d))>= c){
                        return;

                    }
                    if(t < d){ t += step; setTimeout(Run, interval); }
                }
                Run();

                (function(){
                    setInterval(function(){
                        clock.value = new Date().getSeconds();
                    }, 1)
                })()
            }
    	</script>
    </body>
</html>
